<template>
    <TemplateTitle titleName="资产保值率（%）"></TemplateTitle>
    <div class="chart">
        <chart-rate-line :chartData="chartDataList" xAxisName="month" :option="option" :chartType="chartType"
            :twoYAxis="false" :unit="unit" :orient="'horizontal'"></chart-rate-line>
    </div>
</template>

<script setup>
import TemplateTitle from "@/components/common/templateTitle.vue"

import homeHttp from "@/https/home.js"
import { onMounted, ref } from "vue"
import ChartRateLine from "./charts/ChartRateLine.vue"

const chartDataList = ref([])
const option = ref({})
const chartType = ref([
    {
        type: "line",
        code: "assetRetentionRatio",
        name: "资产保值率",
        linerColor: ["#fa6934", "#fa6934"],
    }
])
const unit = ref([])

onMounted(() => {
    queryFinancialData()
})

const queryFinancialData = () => {
    homeHttp.queryFinancialData().then(res => {
        if (res.data.code == 200) {
            res.data.data.forEach((item) => {
                item.month = item.month + '月'
            })
            chartDataList.value = res.data.data
        }
    })
}
</script>

<style scoped></style>
